// 确保导入 store和router
// 导入 store 是为了修改 vuex 中的数据
// 导入 router 是为了跳转到 登录页

import router from '@/router'

// 导入存放 token 值 的 js
import store from '@/store'

// 导入axios（确保 安装过了，查看package.json 里面，是否有 axios 这个记录）
import axios from 'axios'
// 导入之后，配置axios
const request = axios.create({
  baseURL: 'http://big-event-vue-api-t.itheima.net'

  // 全局都加 请求头  意味着 登录和注册 都有请求体 ， 加上也不会报错
  // headers: { Authorization: token字符串 }
})

// request.defaults.headers.common['Authorization'] = token字符串
// 使用请求拦截器
request.interceptors.request.use(
  function (config) {
    // 在发送请求之前做些什么
    // ❗❗❗ config 是请求的配置对象，参见：https://www.axios-http.cn/docs/req_config

    // config.headers.Authorization = token字符串

    // headers 是 axios 官方文档 里面  的 自定义请求头

    // 登录注册 是 api开头的 没必要加请求头 所以要判断

    // 判断 用 字符串方法 startsWith 查看开头是不是 以  '/my/ 开头的 true , 不是是 false

    if (config.url.startsWith('/my/')) {
      // 是的话 ，给 headers 添加 Authorization请求头 并赋值给 token 值
      config.headers.Authorization = store.state.user.token
    }
    // 拦截器自带的
    return config
  },
  function (error) {
    // 对请求错误做些什么(有多个axios实例的情况，才有可能遇到错误，否则这个函数用不上)
    return Promise.reject(error)
  }
)

// oken过期或者使用的假token，也不能访问首页
// 我们前端是无法判断token是否过期的，所以只能根据接口返回的结果进行判断。

// 添加响应拦截器
request.interceptors.response.use(
  function (response) {
    // 2xx 范围内的状态码都会触发该函数。
    // 对响应数据做点什么
    return response
  },
  function (error) {
    // 超出 2xx 范围的状态码都会触发该函数。
    // 对响应错误做点什么
    // error.response 是一个对象，类似成功中的 res 对象
    if (error.response) {
      const { data: res } = error.response
      console.log(res)
      if (res.code === 1 && res.message === '身份认证失败！') {
        // 进入这个判断，说明用户用了过期的，或者假的 token
        // 清空 token
        store.commit('user/updateToken', '')
        // 清空 用户信息
        store.commit('user/updateUser', {})
        // 跳转到 登录页
        router.push('/login')
      }
    }
    return Promise.reject(error)
  }
)

// 导出
export default request
